<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link rel="shortcut icon" href="../images/favicon.ico" type="image/x-icon" />
<title>Velkata-admin</title>
<!-- <link type="text/css" rel="stylesheet" href="/stylesheets/main-green.css" /> -->
<script src="https://www.google.com/jsapi?key=ABQIAAAALaBYjHTT3MscB32QQ5om3hS3YBVzhUhNvM0yrSz-CK8h7wVqSBQsqNXabK-ORWN2cIAsZB9x3no9eQ" type="text/javascript"></script>
<script type="text/javascript">	
	google.load("jquery", "1.6.4");
	google.load("jqueryui", "1.8.16");    

	function OnLoad(){
		//$("#draggable-handle-div").draggable({"handle": "div"});
		
		var cat = getParameter('cat');
		var cat_list = document.getElementById('cat');
		if (cat){
			for (i=0; i<cat_list.options.length; i++)
			{
				if (cat_list.options[i].text == cat.replace("+"," ")) {
					document.getElementById('cat').options.selectedIndex = i;
				}
			}
		}
	}
	
	function getParameter(paramName) {
	  var searchString = window.location.search.substring(1),
		  i, val, params = searchString.split("&");

	  for (i=0;i<params.length;i++) {
		val = params[i].split("=");
		if (val[0] == paramName) {
		  return unescape(val[1]);
		}
	  }
	  return null;
	}
	
	function editComment(strModifyAction, strCommentID){
		document.getElementById('comments_modify_action').value = strModifyAction;
		document.getElementById('comment_id').value = strCommentID;
		//Some epic client side validation
		var comment_ = "comment_"+strCommentID.toString()
		/*if (!document.getElementById(comment_).value){
			alert("The Comment field is mandatory.");
			document.getElementById(comment_).focus();
		}else{
			document.getElementById('edit_comment').submit();
		}*/
		document.getElementById('edit_comment').submit();
	}
	
	function editPost(strModifyAction){
		document.getElementById('posts_modify_action').value = strModifyAction;
		//Some epic client side validation
		/* 
		if (!document.getElementById('title').value || !document.getElementById('content').value){
			alert("The Title and Content fields are mandatory.");
		}else{
			document.getElementById('edit_post').submit();
		}*/
		document.getElementById('edit_post').submit();
	}
	
	function newPost(){
		/* if (strModifyAction=="Preview"){
		}else{
			//Some epic client side validation
			if (!document.getElementById('title').value || !document.getElementById('content').value){
				alert("The Title and Content fields are mandatory.");
			}else{
				document.getElementById('new_post').submit();
			}
			
		} */
		document.getElementById('new_post').submit();
	}
	
	function posts_list(ID){
		//var selected = document.getElementById('cat').options.selectedIndex;
		//var category = document.getElementById('cat').options[selected].text;
		document.getElementById('posts_list').submit();
	}

	google.setOnLoadCallback(OnLoad);
</script>
<!-- Load TinyMCE -->
<script type="text/javascript" src="../tools/tinymce/jscripts/tiny_mce/tiny_mce.js"></script>
<script type="text/javascript">
	tinyMCE.init({
		// General options
        mode : "exact",
        elements : "content",
		theme : "advanced",
		skin : "o2k7",
		skin_variant : "black",
		plugins : "autolink,lists,pagebreak,style,layer,table,advhr,advimage,advlink,emotions,iespell,inlinepopups,insertdatetime,preview,media,searchreplace,print,contextmenu,paste,directionality,fullscreen,noneditable,visualchars,nonbreaking,xhtmlxtras,template,wordcount,advlist,autosave,syntaxhl",

		// Theme options
		theme_advanced_buttons1 : "bold,italic,underline,strikethrough,|,justifyleft,justifycenter,justifyright,justifyfull,styleselect,formatselect,fontselect,fontsizeselect,syntaxhl",
		theme_advanced_buttons2 : "cut,copy,paste,pastetext,pasteword,|,search,replace,|,bullist,numlist,|,outdent,indent,blockquote,|,undo,redo,|,link,unlink,anchor,image,cleanup,help,code,|,insertdate,inserttime,preview,|,forecolor,backcolor",
		theme_advanced_buttons3 : "tablecontrols,|,hr,removeformat,visualaid,|,sub,sup,|,charmap,emotions,iespell,media,advhr,|,print,|,ltr,rtl,|,fullscreen",
		theme_advanced_buttons4 : "insertlayer,moveforward,movebackward,absolute,|,styleprops,|,cite,abbr,acronym,del,ins,attribs,|,visualchars,nonbreaking,template,pagebreak,restoredraft",
		theme_advanced_toolbar_location : "top",
		theme_advanced_toolbar_align : "left",
		theme_advanced_statusbar_location : "bottom",
		theme_advanced_resizing : true,

		// Example content CSS (should be your site CSS)
		//content_css : "css/content.css",

		// Drop lists for link/image/media/template dialogs
		template_external_list_url : "lists/template_list.js",
		external_link_list_url : "lists/link_list.js",
		external_image_list_url : "lists/image_list.js",
		media_external_list_url : "lists/media_list.js",

		// Style formats
		style_formats : [
			{title : 'Bold text', inline : 'b'},
			{title : 'Red text', inline : 'span', styles : {color : '#ff0000'}},
			{title : 'Red header', block : 'h1', styles : {color : '#ff0000'}},
			{title : 'Example 1', inline : 'span', classes : 'example1'},
			{title : 'Example 2', inline : 'span', classes : 'example2'},
			{title : 'Table styles'},
			{title : 'Table row 1', selector : 'tr', classes : 'tablerow1'}
		],

		// Replace values for the template plugin
		template_replace_values : {
			username : "Some User",
			staffid : "991234"
		}
	});
</script>
<!-- TinyMCE -->
</head>
<body style="width:95%;">
<noscript>JavaScript Disabled. Please enable JavaScript!</noscript>
<table>
	<tr>
	<td id="main_column_1" style="vertical-align:top;">
		<br/><a href="/administrator/" >New Post</a><br/><br/>
		Article Titles<br/>Categories 
		<form action="/administrator/" id="posts_list" method="get" >
			<div>
				<select id="cat" name="cat" onchange="posts_list();" >
					<option selected>All</option>
					{% for item in categories %}
						<option>{{item}}</option>
					{% endfor %}
				</select>
			<div>
			<div id="div_links">
				{{titles_list}}
			</div>
		</form>						
	</td>
	<td id="main_column_2" style="width:80%;">
	{% if post_id %}			
		<form action="/administrator/edit_post" id="edit_post" method="post" />	
			<div>
				<label id="lbl_title">Article ID: {{ article_id }}</label><br/>
				<label id="lbl_title">Title: </label><br/>
				<textarea id="title" name="title" style="width:100%;">{{ post_id.title }}</textarea><br/>
				<label id="lbl_category" >Category: </label><br/>
				<input type="text" id="category" name="category" style="min-width:50%;" value="{{ post_id.category }}" /><br/>
				<label id="lbl_content" >Content: </label>
			</div>
			<div id="posts">
				<textarea id="content" name="content" style="width:100%;min-height:400px;">{{ post_id.content }}</textarea><br/>
				<a href="javascript:;" onmousedown="editPost('Save');" >[Save]</a> |
				<a href="javascript:;" onmousedown="editPost('Delete');">[Delete]</a>
				<a href="javascript:;" onmousedown="tinymce.execCommand('mceToggleEditor',false,'content');">[Toggle Editor]</a>
				| [Set Visible] {{ visibiliy }}	<br/>			
				<input type="hidden" name="post_id" id="post_id" value="{{ article_id }}" />
				<input type="hidden" name="posts_modify_action" id="posts_modify_action" value="" />
			</div>
		</form>
		{% if comments_list %}
			<div id="comments_panel">
				<form action="/administrator/edit_comment" id="edit_comment" method="post" />
					Comments:<br/>
					{{comments_list}}
					<input type="hidden" name="comment_id" id="comment_id" value="" />
					<input type="hidden" name="post_id" id="post_id_comments" value="{{article_id}}" />
					<input type="hidden" name="comments_modify_action" id="comments_modify_action" value="" />
				</form>
			</div>				
		{% endif %}
	{% else %}
		<form action="/administrator/new_post" id="new_post" method="post" />
			<label id="lbl_title" >Title: </label><br/>
			<textarea id="title" name="title" rows="3" cols="100"></textarea><br/>
			<label id="lbl_category" >Category: </label><br/>
			<input type="text" id="category" name="category" style="width:25em;" /><br/>
			<label id="lbl_content" >Content: </label><br/>
			<textarea id="content" name="content" rows="30" cols="100"></textarea><br/><br/>
			<a href="javascript:;" onmousedown="newPost();" >[Save]</a>
			| [Set Visible] <input type="checkbox" name="visible" id="visible" checked="checked" />
		</form>
	{% endif %}
	</td>
	</tr>
</table>
</body>
</html>